<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 停止定时器
        //clearInterval(定时器ID);
        //setInterval()的返回值就是定时器ID
        let b = setInterval(a, 500)
        clearInterval(b)


        // 表单控件不可选中
        input.disabled
        赋值为true, 可以正常显示
        赋值为false, 表单控件不可点击


        //注册事件
        // 点击类型 click
        // 注册事件三个要素:  事件源 + 事件类型 + function(){} 处理程序
        // 事件源: 就是一个具体的标签对象
        // 事件类型: 代表的用户动作   click (用户的点击动作)
        // 处理程序fuction(){}:  执行事件中对应的代码
        // 语法: 事件源.addEventListener('事件类型', function(){})
        // 注意:
        // 1. 注册事件的时候,必须是一个具体的标签对象
        // 2. 如果得到的结果是一个数组,数组中有标签对象,那么必须先遍历数组,然后注册事件
        button.addEventListener('click', function () {
            alert('唔系古天乐,唔系渣渣辉,是兄弟就来砍我')
        })



        // 获取元素的方式
        // ☞ 获取单个标签(只能获取一个标签)
        document.querySelector()        //获取单个 css选择器 的标签
        document.getElementById()       //获取单个 ID 的标签
        // ☞ 获取多个标签,返回值都是数组
        document.querySelectorAll()     //获取所有相同 css选择器 的标签
        document.getElementsByTagName() //获取所有同一个 HTML标签名 的标签
        // ☞ 获取固定的标签
        document.body                   //获取body
        document.documentElement        //获取HTML




        // 操作元素样式
        // 给标签设置 行内样式 可以用 style
        // 给标签设置 类样式 可以用 className

        // 通过style设置行内样式  
        // 语法:  标签对象.style.css属性 = 值
        div.style.backgrand = 'cyan'

        // ☞ 通过className设置类样式
        // 语法:  标签对象.className = '类名  类名'
        a[i].className = 'box'  //样式为 box
        div.className = ''      //为空则取消所有class




        // 排他思想: 干掉所有的标签,给当前对应的标签设置样式
        // 利用for循环得到所有的标签
        // 适用于取消定时器
    </script>
</body>

</html>